<?php
	header('Content-Type: text/html; charset=utf-8');
	?>
	<link rel="stylesheet" type="text/css" href="new_file.css"/>
	<script src="jquery.min.js" type="text/javascript" charset="utf-8"></script>
	<!--开头结束-->

	<!--js专区-->
	<script type="text/javascript">
	$(function(){
//		点击数字变色
		$(".shuzi").mousedown(function(){
			$(this).css({'background':'url(66.jpg) no-repeat','background-size':'100% 100%','font-size': '38px','font-weight': '700'}).siblings().css({'background':'url(timg.jpg) no-repeat','background-size':'100% 100%','font-size': '39px','font-weight': '700'})
		})
		$(".shuzi").mouseup(function(){
			
			$(this).css({'background':'url(timg.jpg) no-repeat','background-size':'100% 100%','font-size': '39px','font-weight': '700'}).siblings().css({'background':'url(timg.jpg) no-repeat','background-size':'100% 100%','font-size': '39px','font-weight': '700'})
		})
//		点击数字变色结束       
//		点击符号变色
		$(".fuhao").mousedown(function(){
			$(this).css({'background':'url(66.jpg) no-repeat','background-size':'100% 100%','font-size': '38px','font-weight': '700'}).siblings().css({'background':'url(timg.jpg) no-repeat','background-size':'100% 100%','font-size': '39px','font-weight': '700'})
		})
		$(".fuhao").mouseup(function(){
			
			$(this).css({'background':'url(timg.jpg) no-repeat','background-size':'100% 100%','font-size': '39px','font-weight': '700'}).siblings().css({'background':'url(timg.jpg) no-repeat','background-size':'100% 100%','font-size': '39px','font-weight': '700'})
		})
//		点击符号变色结束       
//		点击符号变色
		$(".qingchu").mousedown(function(){
			$(this).css({'background':'url(66.jpg) no-repeat','background-size':'100% 100%','font-size': '38px','font-weight': '700'}).siblings().css({'background':'url(timg.jpg) no-repeat','background-size':'100% 100%','font-size': '39px','font-weight': '700'})
		})
		$(".qingchu").mouseup(function(){
			
			$(this).css({'background':'url(timg.jpg) no-repeat','background-size':'100% 100%','font-size': '39px','font-weight': '700'}).siblings().css({'background':'url(timg.jpg) no-repeat','background-size':'100% 100%','font-size': '39px','font-weight': '700'})
		})
//		点击符号变色结束       
//		点击点变色
		$(".dian").mousedown(function(){
			$(this).css({'background':'url(66.jpg) no-repeat','background-size':'100% 100%','font-size': '38px','font-weight': '700'}).siblings().css({'background':'url(timg.jpg) no-repeat','background-size':'100% 100%','font-size': '39px','font-weight': '700'})
		})
		$(".dian").mouseup(function(){
			
			$(this).css({'background':'url(timg.jpg) no-repeat','background-size':'100% 100%','font-size': '39px','font-weight': '700'}).siblings().css({'background':'url(timg.jpg) no-repeat','background-size':'100% 100%','font-size': '39px','font-weight': '700'})
		})
//		点击点变色结束       

   
//     获得点击按键的值   
		var str='';		
		var str2='';
		var fu='';
	     
	      var dian='';	      
        $(".shuzi").click(function(){
//      	如果没有运算符则
//         当运算符为空时
        	if(fu==''){       		
//      		而且第一组数字长度不超过8位时
        		if(str.length<8){       
//      			获得这个键的值			
        	var c=$(this).val();
//      	    这个数值等于按键加上上一个按键
        	str =str +c;
//                设定一个正则,规则为第一位数不能以0开头
                    var zk=/^0{1,}[0-9]+/;
                    var kk=zk.test(str);
//                    如果以0开头
                    if(kk){
//                  	第一位数清空
                    	str='';
//                  	顶部输入框清零
                    	$(".top").html('');
//                  	底部输入框报错
                    	$(".bottom").html('!非小数不能以零开头');
                    }else{
                    	
//                  	否则将第一组 显示到屏幕上
                    	 $(".top").html(str);
//      	                         为了美观清空结果栏
        	            $(".bottom").html('');       	 
                    }       	
        	}else{
        		$(".bottom").html('单次最多输入8位数字');
        	}
//      	 第一数字完毕
        	}else{
//      		否则,当已经有运算符存在的情况下,判定为第二组数字
//                 且这组数字不能超过8位
        		if(str2.length<8){
//      			获得这个键值
        		var c1=$(this).val();
//      		     第二组数值等于按键加上上一个按键/
        		str2=str2+c1;
        		var zk=/^0{1,}[0-9]+/;
                    var kk=zk.test(str2);
                    if(kk){
//                  	第二位数清空
                         str='';
                    	str2='';
//                  	顶部输入框清零
                    	$(".top").html('');
//                  	底部输入框报错
                    	$(".bottom").html('!非小数不能以零开头');	
                    }else{
//	     将第一组和第二组数字都输出到屏幕上
        		$(".top").html(str+str2);        		
        		
//      		获取第二个数字hiden的值 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++                    
        		$("#dier").val(str2);
//      		为了美观清空结果栏
        		$(".bottom").html('');   
                    	
                    }
        		}else{
        			$(".bottom").html('单次最多输入8位数字');
        		}     		
        	};
        })
//      数字键判定结束

//       点事件开始
       $(".dian").click(function(){
//     	当第一个数字有,而且符号为空时可以输入第一个点
       	if(str!==''&&fu==''){
//         创建正则表达式
//              当这个点在中间,而且只有一个时才能输出
              var zk=/^.*\..*$/;
//		获得这个点的值
              var qq=zk.test(str);
              if(!qq){
              	  		bn=$(this).val();
       		str=str+bn;
       		$(".top").html(str+str2);
              } 	
       	}else if(str2!==''){
//     		获得这个点的值
           var zk=/^.*\..*$/;
              var qq=zk.test(str2);
              if(!qq){
  	  		xt=$(this).val();
       		str2=str2+xt;
       		$(".top").html(str+str2);
              }		
       	}else{
//     		$(".top").html('');
     		$(".bottom").html('点号前请先输入数字');
       	}      	
       })
// 点事件结束
 
//         点击运算符时
      $(".fuhao").click(function(){
//	   当第一个数字不等于空而且运算符为空时            
      	if(str!==''&&fu==''){
//    	获的这个运算符按钮的值

      	b=$(this).val();
//    	传值给运算符号hiden域,获得运算符号hiden域的值;++++++++++++++++++++++++++++++++++++++++++++++++++
      	$("#fuhao").val(b); 	
//   	获得第一个输入值hiden域的值++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
           $("#diyi").val(str);
//         传值给判断符号fu
             fu=b;            
//           输出第一个数字和符号相加以连接
              str=str+b;
//              输出str
     	$(".top").html(str);    
     		    	    	
     	}else if(fu==''){
     		$(".top").html('');
     		$(".bottom").html('运算前先输入数字');
     	}
    })
    
//  符号点击完毕
//          清除开始
          $(".qingchu").click(function(){
          	str='';
          	str2='';
          	fu='';
          	$("#diyi").val('');
          	$("#dier").val('');
          	$("#fuhao").val('');
          	$(".top").html('');
          	$(".bottom").html('');
          	
          })
//          清除完毕/

          
	})		
//		js
	</script>
	<?php 
		
	if(isset($_POST['diyi'])){
         if($_POST['fuhao']=='+'){
			$re = $_POST['diyi']+$_POST['dier' ];			
		}else if($_POST['fuhao']=='-'){
			$re = $_POST['diyi']-$_POST['dier' ];			
		}else if($_POST['fuhao']=='x'){
			$re = $_POST['diyi']*$_POST['dier' ];			
		}else if($_POST['fuhao']=='/'){
			$re = $_POST['diyi']/$_POST['dier' ];			
		}
	}
		
		
		
		?>
	
	        <div id="zhuti">
               	<!--头顶小孔区-->
	        	<ul class="kong">
	        		<li></li>
	        		<li></li>
	        		<li></li>	        		
	        	</ul>	        	
	        	<!--头顶小区结束-->	    	        	
	        	<!--屏幕区-->
	        	<div class="pingmu">
	        		<div class="top">
                        
                          <?php
                          	if(isset($_POST['diyi'])){
                          		echo "{$_POST['diyi']}{$_POST['fuhao']}{$_POST['dier' ]}=";
                          	}
                          	
                          	?>
	        		</div>
	        		<div class="bottom">	
                       		 <?php
                       		 	if(isset($_POST['diyi'])){
                       		 		if ($_POST['diyi']=='' or $_POST['dier']=='' ){
			                  echo '请重新输入';
			                  $_POST['diyi']=='';
		                        }else{
		                        	echo "{$re}"; 	
		                        }
                       		 		
                       		 	}
                          	
                          	?>
	        		</div>	        		
	        	</div>
	        	<form action="" method="post" class="fm">
	        		<input type="button" name="qi" id="qi" value="7" class="shuzi"/>
	        		<input type="button" name="ba" id="ba" value="8" class="shuzi" />
	        		<input type="button" name="jiu" id="jiu" value="9" class="shuzi" />
	        		<input type="button" name="si" id="si" value="4" class="shuzi" />
	        		<input type="button" name="wu" id="wu" value="5" class="shuzi" />
	        		<input type="button" name="liu" id="liu" value="6" class="shuzi" />
	        		<input type="button" name="yi" id="yi" value="1" class="shuzi" />
	        		<input type="button" name="er" id="er" value="2" class="shuzi" />
	        		<input type="button" name="san" id="san" value="3" class="shuzi" />
	        		<input type="button" name="ling" id="ling" value="0" class="shuzi" />
	        		<input type="button" name="dian" id="dian" value="." class="dian" />
	        		
	        		
	        		
	        		<!--符号-->
	        		<input type="button" name="jia" id="jia" value="+" class="fuhao" />
	        		<input type="button" name="jian" id="jian" value="-" class="fuhao" />
	        		<input type="button" name="cheng" id="cheng" value="x" class="fuhao" />
	        		<input type="button" name="chu" id="chu" value="/" class="fuhao" />
	        		<div class="zz">
	        		<input type="button" name="qingchu" id="qingchu" value="C" class="qingchu" />
	        		
	        		<!--符号结束-->

	        		<input type="submit" name="dengyu" id="dengyu" value="="  />
	        		<input type="hidden" name="diyi" id="diyi" value="" />
	        		<input type="hidden" name="fuhao" id="fuhao" value="" />
	        		<input type="hidden" name="dier" id="dier" value="" />
	        		
	        		
	        		

	        		
	        		</div>        		
	        	</form>
	        	
	        	
	        </div>
	